
import React from "react";

interface SpinnerIconProps {
    size?: number | string;
    color?: string;
}

const spinKeyframes = `
  @keyframes spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
`;

export const SpinnerIcon: React.FC<SpinnerIconProps> = ({
    size = 20,
    color = "currentColor",
}) => {
    return (
        <>
            <style>{spinKeyframes}</style>
            <svg
                xmlns="http://www.w3.org/2000/svg"
                viewBox="0 0 24 24"
                fill="none"
                stroke={color}
                strokeWidth="2"
                strokeLinecap="round"
                strokeLinejoin="round"
                width={size}
                height={size}
                style={{ animation: "spin 1s linear infinite" }}
            >
                <path d="M21 12a9 9 0 1 1-6.219-8.56" />
            </svg>
        </>
    );
};